<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Кабинет пользователя </title>
    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
    <link rel="stylesheet" type="text/css" href="/css/template.css"/>
    <link rel="stylesheet" type="text/css" href="/css/gallery.css"/>
    <link rel="stylesheet" type="text/css" href="/css/dark.css"/>
    <link rel="stylesheet" type="text/css" href="/css/buttons.css"/>
    <link href='http://fonts.googleapis.com/css?family=Lobster&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="/css/data_table/jquery.dataTables.css"/>
    <link rel="stylesheet" type="text/css" href="/css/data_table/jquery.dataTables_themeroller.css"/>


    <script type="text/javascript" src="/js/jquery-1.8.2.js"></script>
    <script type="text/javascript" src="/js/jquery.easing.min.js"></script>
    <script type="text/javascript" src="/js/jquery.easing.compatibility.js"></script>
    <script type="text/javascript" src="/js/jquery.lavalamp.min.js"></script>

    <script type="text/javascript" src="/js/myriad.js"></script>
    <script type="text/javascript" src="/js/menu.js"></script>
    <script type="text/javascript" src="/js/data_table/jquery.dataTables.js"></script>
    <script type="text/javascript">
        $('document').ready(function() {
            $('#orders').dataTable();
        });
    </script>
</head>

<body>
<div class="container_16">
    <jsp:include page="static/header.jsp"/>
    <jsp:include page="static/menu.jsp"/>
    <div class="grid_16 content">
        <div class="grid_10">
            <div class='title' style="margin:10px">
                <h1>Ваши заказы</h1>
            </div>
            <c:set var="total" value="0"/>
            <div class="orders_table" style="margin:10px;">
                <table cellpadding="0" cellspacing="0" border="0" class="display" id="orders">
                    <thead>
                    <tr>
                        <th>Описание</th>
                        <th>Количество</th>
                        <th>Цена</th>
                        <th>Дата</th>
                    </tr>
                    </thead>

                    <tbody>
                    <c:forEach var="order" items="${orders}">
                        <tr>
                            <td>
                                    ${order.lantern.description}
                            </td>
                            <td>
                                    ${order.amount}
                            </td>
                            <td>
                                    ${order.lantern.price}
                            </td>
                            <td>
                                <fmt:formatDate type="both"
                                                dateStyle="short" timeStyle="short"
                                                value="${order.date}"/>
                            </td>
                        </tr>
                        <c:set var="total" value="${total + order.amount*order.lantern.price}"/>
                    </c:forEach>

                    </tbody>
                </table>

            </div>
        </div>
        <div class="grid_6" style="float:right;">
            <div class='title'>
                <h1>Сумма заказов</h1>

                <div class="sum" style="text-align: center">
                    <img src="/img/source/cabinet-pig.png"/>

                    <h3 style="color: #a1a1a1">${total}</h3>
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <jsp:include page="static/footer.jsp"/>
</div>

</body>
</html>